<template>
<div>

  <van-swipe :autoplay="3000" indicator-color="white" class="swiper-container">
    <van-swipe-item v-for = '(item,index) in sliderList' :key = 'index' @click="goShopList">
        <img :src="item.imgUrl" class="swiper_img" alt="">
    </van-swipe-item>
</van-swipe>

</div>
</template>

<script>
//监听轮播图变化  轮播点的制作
import { Toast } from 'vant';
//导入轮播数据网络请求接口
import {getSliders} from '../../../api'
    export default {
        onChange(index) {
              Toast('当前 Swipe 索引：' + index);
         },
        data(){
            return{
                sliderList:[]
            }
        },
        created() {
            // console.log('asd');
            // 获取首页 初始化数据
            // this.fetchSliders();
            this.fetchSliders();
         },
        methods:{
            goShopList(){
            //    console.log('asd');
        this.$router.push({path:'/productlist' })
            },
            //初始化数据
            fetchSliders() {

                //获取轮播图数据
                  getSliders((res) => {
                    // console.log(res);
                    this.sliderList = res.data;
                  });
                // console.log('asd',this.sliderList);


          
            }
        }
    }
</script>

<style lang="scss" scoped>
.swiper-container {
        color: #000;
    .swiper_img {
        width: 100%;
    }
}

</style>